<table id="cal-table" *ngIf="calendar && showDate">
  <tr id="cal-btns-wrap" style="color: white;">
    <td><button md-button class="arrow-btn" (click)="calPrev()">&lt;</button></td>
    <td colspan="6"><button md-button (click)="calToday()" >{{calendar.title}}</button></td>
    <td><button md-button class="arrow-btn" (click)="calNext()">&gt;</button></td>
  </tr>
  <tr>
    <th>周</th>
    <th>日</th><th>一</th><th>二</th><th>三</th><th>四</th><th>五</th><th>六</th>
  </tr>
  <tr *ngFor="let week of calendar.weeks">
    <td class="week-num"><button md-button disabled>{{week.num}}</button></td>
    <td class="day-num" *ngFor="let day of week.days"><button md-button
        [ngClass]="{ today: day.y == calendar.today.y &&
              day.m == calendar.today.m && day.num == calendar.today.num,
            curr: day.m == calendar.curr.m,
            active: showDate.y == day.y && showDate.m == day.m &&
            showDate.num == day.num }"
        (click)="changeShowDate(day)" class="icon-{{day.state}}">{{day.num}}</button></td>
  </tr>
</table>
<div>
<div style="margin-top: 15px;margin-left: 20px; margin-bottom: 15px;">
  <span>工时统计:</span>
</div>
<div style="margin-left: 20px;margin-bottom: 10px;">
  <img src="assets/images/icon-yellow.png"/><i>低于12</i>
  <img src="assets/images/icon-green.png"/><i>12-20</i>
  <img src="assets/images/icon-red.png"/><i>高于20</i>
</div>
</div>